$(function () {
        $("#jqGrid").jqGrid({
            url: baseURL + 'water/allreport/reportarea',
            datatype: "json",
            postData:{'param':vm.q.key},
            colModel:[
                { label: '系统类型', name: 'data6', index: 'data6', sortable:false,align:'center',width: 80, hidden : true},
                { label: '区域', name: 'data5', index: 'data5', sortable:false,align:'center',width: 80 },
                { label: '小区', name: 'data1', index: 'data1', sortable:false,align:'center',width: 100 },
                { label: '用水户数', name: 'data4', index: 'data4', sortable:false,align:'center',width: 80 },
                { label: '单表故障', name: 'data3', index: 'data3', sortable:false,align:'center',width: 80 },
                { label: '板故障', name: 'data2', index: 'data2', sortable:false,align:'center',width: 80 },
                { label: '新增故障', name: 'data7', index: 'data7', sortable:false,align:'center',width: 80 },
                { label: '人员分配', name: 'data8', index: 'data8', sortable:false,align:'center',width: 80, hidden : true },
            ],
            viewrecords: true,
            height:$(window).height()-100,
            rowNum: 3000,//jqdata.length,
            //rowList : [10,30,50],
            rownumbers: true,
            rownumWidth: 50,
            autowidth:true,
            //multiselect: true,
            //footerrow: true,
            //pager: "#jqGridPager",
            jsonReader : {
                root: "page.page",
                page: "page.currPage",
                total: "page.totalPage",
                records: "page.totalCount"
            },
            prmNames : {
                page:"page",
                rows:"limit",
                order: "order"
            },
            gridComplete:function(){
                //隐藏grid底部滚动条
                $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });

                $(window).on('resize', function() {
                    var $content = $('.content');
                    $content.height($(this).height() - 150);
                    $content.find('iframe').each(function() {
                        $(this).height($content.height());
                    });
                }).resize();
            }
        });
    //});
});

var vm = new Vue({
    el:'#rrapp',
    data:{
        q:{
          key:1,
        },
    },
    methods:{
        query: function (event) {
            vm.reload(event);
        },
        outxls: function(){
            var url = baseURL
                + "water/allreport/export?params="
                + encodeURIComponent(JSON.stringify({param:vm.q.key}));
            location.href = url;
        },
        reload: function (event){
            $("#jqGrid").setGridParam().hideCol("data6");
            $("#jqGrid").setGridParam().hideCol("data8");

            if (event != 1) {
                $("#jqGrid").setGridParam().showCol("data6");
            }
            if (event == 2) {
                $("#jqGrid").setGridParam().showCol("data8");
            }

            vm.q.key = event;
            $("#jqGrid").jqGrid('setGridParam',{
                postData:{'param':event},
            }).trigger("reloadGrid");
        },
    },
    created:function (){

    }
});